<template>
  <!--批量管理-->
  <section class="page batch-manage">

    <data-box :data="taskList" @onPageChange="refreshData" :page="pageService" ref="data-box">
      <template slot="columns">
        <el-table-column label="操作" :min-width="$helper.getColumnWidth(6)">
          <template slot-scope="scope">
            <el-button type="text" @click="rowData = scope.row, dialog.isOpenTriggerList = true">触发器</el-button>
            <template v-if="scope.row.jobGroup === TaskGroup.ENABLE">
              <el-button type="text" @click="rowData = scope.row, dialog.isOpenModifyTask = true">修改</el-button>
              <el-button type="text" @click="runClick(scope.row)">立即执行</el-button>
              <el-button type="text" @click="resumeClick(scope.row)"  v-if="scope.row.jobStatus === TriggerState.PAUSED">恢复</el-button>
              <el-button type="text" @click="pauseClick(scope.row)" v-else>暂停</el-button>
              <el-button type="text" @click="deleteClick(scope.row)">删除</el-button>
            </template>
          </template>
        </el-table-column>
        <el-table-column prop="jobName" label="任务名称" :min-width="$helper.getColumnWidth(4)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="description" label="任务描述" :min-width="$helper.getColumnWidth(6)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="jobStatus" label="状态" :min-width="$helper.getColumnWidth(3)">
          <template slot-scope="scope">
            <span>{{getTriggerState(scope.row.jobStatus)}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="prevFireTime" label="上次执行时间" :min-width="$helper.getColumnWidth(4)">
        </el-table-column>
        <el-table-column prop="nextFireTime" label="下次执行时间" :min-width="$helper.getColumnWidth(4)">
        </el-table-column>
      </template>
    </data-box>

    <!-- 修改定时任务信息 -->
    <el-dialog title="任务信息" :close-on-click-modal="false" :visible.sync="dialog.isOpenModifyTask" :show-close="false" @open="$nextTick(() => $refs['modify-task'].refresh())">
      <modify-task ref="modify-task" :rowData="rowData" @refreshData="refreshData" @close="dialog.isOpenModifyTask = false"></modify-task>
    </el-dialog>

    <!-- 触发器列表 -->
    <el-dialog title="触发器列表" :close-on-click-modal="false" :visible.sync="dialog.isOpenTriggerList" @open="$nextTick(() => $refs['trigger-list'].refresh())" @close="refreshData()">
      <trigger-list ref="trigger-list" :rowData="rowData" @refreshData="refreshData" @close="dialog.isOpenTriggerList = false"></trigger-list>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Auth, Layout, Dependencies } from '~/core/decorator';
import DataForm from '~/components/common/data-form.vue';
import DataBox from '~/components/common/data-box.vue';
import { TaskService } from '~/service/service-manage/task.service';
import { State, Getter } from 'vuex-class';
import { PageService } from '~/util/page.service';
import ModifyTask from '~/components/system-manage/task-manage/modify-task.vue';
import TriggerList from '~/components/system-manage/task-manage/trigger-list.vue';
import { TriggerState, TRIGGER_STATE_LABEL, TaskGroup } from '~/components/system-manage/task-manage/job-trigger.config';

@Auth(856)
@Layout("workspace")
@Component({
  components: {
    DataForm,
    DataBox,
    ModifyTask,
    TriggerList,
  }
})
export default class TaskManage extends Vue {
  @Dependencies(TaskService) private taskService: TaskService;
  @Dependencies(PageService) private pageService: PageService;

  private TRIGGER_STATE_LABEL: any = TRIGGER_STATE_LABEL
  private TaskGroup: any = TaskGroup
  private TriggerState: any = TriggerState

  // 定时任务数据
  private taskList: Array<any> = [];
  // 弹框控制
  private dialog: any = {
    isOpenModifyTask: false,
    isOpenTriggerList: false,
  }
  private rowData: any = null
  private activated() {
    this.refreshData()
  }

  private getTriggerState(state) {
    const temp: any = this.TRIGGER_STATE_LABEL.find(x => x.state === state)
    return temp ? temp.label : ''
  }

  /**
   * 查询任务列表
   */
  private refreshData() {
    this.taskService.findTaskByPage(this.pageService).subscribe(
      data => this.taskList = data,
      ({ msg }) => this.$message.error(msg)
    )
  }

  /**
   * 修改
   */
  private modifyClick(scope) {
    this.dialog.isOpenModifyTask = true
    this.$nextTick(() => {
      let form: any = this.$refs['modify-task']
      form.refresh(scope.row)
    })
  }

  /**
   * 删除
   */
  private deleteClick(row) {
    this.$confirm("删除不可再恢复，确定删除？", "提示", {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    }).then(
      () => {
        this.taskService.deleteJob(this.getParams(row)).subscribe(
          () => this.isSuccess(),
          ({ msg }) => this.$message.error(msg)
        )
      }
    ).catch(() => { })
  }

  /**
   * 立即执行
   */
  private runClick(row) {
    this.$confirm("确定立即执行当前任务？", "提示", {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    }).then(
      () => {
        this.taskService.runJob(this.getParams(row)).subscribe(
          () => this.isSuccess(),
          ({ msg }) => this.$message.error(msg)
        )
      }
    ).catch(() => { })
  }

  /**
   * 暂停
   */
  private pauseClick(row) {
    this.$confirm("确定暂停当前任务？", "提示", {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    }).then(
      () => {
        this.taskService.pauseJob(this.getParams(row)).subscribe(
          () => this.isSuccess(),
          ({ msg }) => this.$message.error(msg)
        )
      }
    ).catch(() => { })
  }

  /**
   * 恢复
   */
  private resumeClick(row) {
    this.$confirm("确定恢复当前任务？", "提示", {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    }).then(
      () => {
        this.taskService.resumeJob(this.getParams(row)).subscribe(
          () => this.isSuccess(),
          ({ msg }) => this.$message.error(msg)
        )
      }
    ).catch(() => { })
  }

  private getParams(row) {
    return {
      jobName: row.jobName,
      jobGroup: row.jobGroup
    }
  }

  private isSuccess() {
    this.refreshData()
    this.$message.success("操作成功")
  }
}
</script>

<style lang="less">

</style>
